<template>
    <div>
        <h1>会员增加</h1>
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td>会员编号</td>
                    <td><input type="text" v-model="quertInfo.MemberCode" disabled></td>
                </tr>
                <tr>
                    <td>手机号</td>
                    <td><input type="text" v-model="quertInfo.Phone" maxlength="11"></td>
                </tr>
                <tr>
                    <td>姓名</td>
                    <td><input type="text" v-model="quertInfo.UserName"></td>
                </tr>
                <tr>
                    <td>身份证号码</td>
                    <td><input type="text" v-model="quertInfo.Card" maxlength="18"></td>
                </tr>
                <tr>
                    <td>会员等级</td>
                    <td>
                        <select v-model="quertInfo.LevelId">
                            <option value="">请选择</option>
                            <option :value="item.LevelName" v-for="item in data.list">{{item.LevelName}}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>生日</td>
                    <td><input type="date" v-model="quertInfo.Birthday"></td>
                </tr>
                <tr>
                    <td>性别</td>
                    <td>
                        <input type="radio" name="sex" :value="1" v-model="quertInfo.Sex">男
                        <input type="radio" name="sex" :value="0" v-model="quertInfo.Sex">女
                    
                    </td>
                </tr>
                <tr>
                    <td>积分</td>
                    <td><input type="text" v-model="quertInfo.JiFen"></td>
                </tr>
                <tr>
                    <td>余额</td>
                    <td><input type="text" v-model="quertInfo.Money"></td>
                </tr>
                <tr>
                    <td align="right"></td>
                    <td><input type="button" value="增加" class="btn btn-primary" @click="ok"></td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import{ref,reactive,onMounted} from 'vue'
import {useRouter} from 'vue-router'
import axios from 'axios';
import moment from 'moment';


const router=useRouter();


//三位随机数
var num=parseInt((Math.random()*1000).toString())+100;


//向后端传输的数据
let quertInfo:any=reactive({

  "MemberCode": moment(new Date()).format("YYYYMMDD")+num ,
  "Phone": "",
  "UserName": "",
  "Card": "",
  "LevelId": "",
  "Birthday": "",
    "Money": '',
  "JiFen": '',
  "Sex": 1,
});

//获取一下等级列表
let data :any=reactive({
    list:[],
});
//onMounted 相当于文档就绪函数 但是生命周期函数onMounted 挂载
onMounted(()=>{
    getlist()
});

//增加会员
const ok=()=>{
    //1.有效性验证
    if(quertInfo.Phone==""){
        alert("手机号不能为空");
            return;
        
    }
    let reg=/^1[3-9]\d{9}$/;
    if(reg.test(quertInfo.Phone)==false){
        alert("手机号不合法");
        return;
    }

    if(quertInfo.UserName==""){
        alert("姓名不能为空");
            return;
        
    }
    
    if(quertInfo.Card==""){
        alert("身份证号码不能为空");
            return;
        
    }
    // let reg1=/^\d{17}{0-9xX}$/;
    // if(reg1.test(quertInfo.Card)==false){
    //     alert("身份证号码不合法");
    //     return;
    // }
    if(quertInfo.LevelId==""){
        alert("等级必选");
            return;
        
    }
    if(isNaN(quertInfo.JiFen)==true){
        alert("必须是数值");
        return;
    }
    if(isNaN(quertInfo.Money)==true){
        alert("必须是数值");
        return;
    }
    //2/发送网络请求
    quertInfo.JiFen=parseInt(quertInfo.JiFen);
    axios({
        method:'post',
        url:'/api/Member/MemberAdd',
        data:quertInfo,

    })
    .then(res=>{
        console.log(res);
        if(res.data>0){
            alert("添加成功");

            router.push('/list');
        }
        else if(res.data==-1)
        {
            alert("身份证号码重复");
            return;
        }
        else
        {
            alert("添加失败");
            return;
        }
        
    })
    .catch(err=>{
        console.log(err);
    })



}




const getlist=()=>{
    axios({
        method:'get',
        url:'/api/Member/GetMemberLevels',
    

    })
    .then(res=>{
        console.log(res);
        data.list=res.data;
    })
    .catch(err=>{
        console.log(err);
    })
}

</script>

<style scoped>

</style>